<docs>
  ## 培训经历
</docs>
<template>
  <div>
    <div class="beijingtu"></div>
    <div class="bg_g">
      <!-- 背景图 -->
      <!-- 基本个人信息 -->
      <div class="box1">
        <co-form :model="data" :rules="rules" ref="form">
          <!-- 事件-->
          <div class="box2 boild">
            <div class="describe">开始时间</div>
            <data-picker prop="pxkssj" v-model="data.pxkssj" class="_date"></data-picker>
          </div>
          <!--时间 -->
          <div class="box2 boild">
            <div class="describe">结束时间</div>
            <data-picker prop="pxjssj" v-model="data.pxjssj" class="_date"></data-picker>
          </div>

          <div class="box2 boild">
            <div class="describe">学校(单位)名称</div>
            <co-input class="pad_left" prop="pxxxmc" v-model="data.pxxxmc" placeholder="请输入"></co-input>
          </div>
          <!-- 职务 -->
          <div class="box2 noob">
            <div class="describe">描述</div>
            <!-- 选择地址层级 开始 所在区 -->
            <!-- <div class="picker" ref="picker">
            <span id="trigger2" class="_input padd" v-model="data.xxszd">{{data.xxszdmc}}</span>
            </div>-->
            <co-input class="pad_left" prop="pxjn" v-model="data.pxjn" placeholder="请输入"></co-input>
          </div>
        </co-form>
      </div>
    </div>
    <div class="bottom"></div>
    <div class="info-bottom" v-if="this.pxjlid==null">
      <button type="button" class="bc" @click="jyjlBc">保&nbsp;&nbsp;存</button>
    </div>
    <div class="info-bottom" v-else>
      <button type="button" class="del" style="margin-left:3%" @click="jydel">删&nbsp;&nbsp;除</button>
      <button type="button" class="bcc" style="margin-left:5%" @click="jyjlBc">保&nbsp;&nbsp;存</button>
    </div>
  </div>
</template>
<script>
import $ from "@/common/js/axios";
import coForm from "@/base/form/form";
import coInput from "@/base/form/input";
import { validator } from "@/common/js/valid";
import PickerExtend from "picker-extend"; //行政区划插件
import { mixinValid } from "@/common/mixins/mixins";
import dataPicker from "@/base/form/dataPicker";
export default {
  components: { coInput, coForm, dataPicker },
  mixins: [mixinValid],
  data() {
    return {
      pxjlid: "",
      // 行政区划
      csList: [],
      //行政区划回显
      positionArr: [],
      data: {
        pxjlid: "", //类型：String  可有字段  备注：14,full,培训经历ID,true
        pxkssj: "", //类型：String  必有字段  备注：10,date,培训开始时间,false
        pxjssj: "", //类型：String  必有字段  备注：10,date,培训结束时间,false
        pxxxmc: "", //类型：String  必有字段  备注：64,full,培训学校名称,false
        pxjn: "" //类型：String  必有字段  备注：32,full,培训技能,false
      },
      rules: {
        pxjlid: validator('14,"full","培训经历ID",true'),
        pxkssj: validator('10,"full","培训开始时间",false'),
        pxjssj: validator('10,"full","培训结束时间",false'),
        pxxxmc: validator('64,"full","培训学校名称",false'),
        pxjn: validator('32,"full","培训技能",false')
      }
    };
  },
  computed: {},
  methods: {
    // 行政区划
    getaddList() {
      this.$loading = true;
      $.get("/dmb/xzyh2jCx").then(res => {
        this.$loading = false;
        // 获取到数组值
        this.csList = res.returnData.xzqhlb;
        // 行政区划回显
        let posiArr = this.randerPosition(this.csList, "");
        this.xzqh(this.csList, posiArr);
      });
    },
    randerPosition(all, tarid) {
      return this.positionArr;
    },
    dgArr(all, str) {
      all.forEach((item, index) => {
        if (item.id == str) {
          this.positionArr.push(index);
          return;
        } else if (item.children) {
          this.dgArr(item.children, str);
        }
      });
    },
    xzqh(addList, posi) {
      var _this = this;
      var _position = posi || [0, 0];
      var pickerExtend = new PickerExtend({
        trigger: "#trigger2",
        title: "请选择",
        wheels: [{ data: addList }],
        keyMap: {
          id: "id",
          value: "name",
          childs: "children"
        },
        flexibleHeight: "80",
        connector: "",
        position: _position,
        callback: function(indexarr, data) {
          // 市 Id 传给后台
          _this.data.pxxxmc = data[1].id;
        }
      });
    },
    // 教育保存
    jyjlBc() {
      if (this.data.pxkssj > this.data.pxjssj) {
        this.$alert({
          type: "warning",
          message: "开始时间不能大于结束时间"
        });
        return false;
      } else {
        this.$refs.form.validate(() => {
          $.post("/wdjl/pxjlBc", this.data).then(res => {
            if (res.returnData.executeResult == "1") {
              this.$alert(
                {
                  type: "success",
                  message: res.returnData.message
                },
                () => {
                  this.$router.push({ path: "/cvitae" });
                }
              );
            } else {
              this.$alert({
                type: "warning",
                message: res.returnData.message
              });
            }
          });
        });
      }
    },

    //教育经历查询
    getpxjl() {
      $.get("/wdjl/pxjlCx?pxjlid=" + this.pxjlid + "").then(res => {
        this.data = res.returnData.pxjl;
      });
    },

    //教育经历删除
    jydel() {
      this.$confirm("确认删除本培训经历吗？", "提示", {
        cancleBtnText: "取消",
        confirmBtnText: "确认"
      })
        .then(() => {
          $.post("/wdjl/pxjlSc", { pxjlid: this.pxjlid }).then(res => {
            if (res.returnData.executeResult == "1") {
              this.$alert(
                {
                  type: "success",
                  message: res.returnData.message
                },
                () => {
                  this.$router.push({ path: "/cvitae" });
                }
              );
            } else {
              this.$alert({
                type: "warning",
                message: res.returnData.message
              });
            }
          });
        })
        .catch(() => {});
    }
  },
  created() {
    let id = this.$route.query.pxjlid;
    this.pxjlid = id;
    if (id) {
      this.getpxjl();
    }
  },
  mounted() {
    // this.getaddList();
  }
};
</script>
<style lang="scss" scoped>
@import "~common/scss/var.scss";
.bg_g {
  padding: 0 34px;
  overflow: hidden;
  position: relative;
}
.boild::after {
  content: " ";
  display: inline-block;
  width: 85%;
  border-bottom: 1px solid rgba(229, 229, 229, 1);
  position: absolute;
  top: 106%;
  // right: 0.64rem;
}
.padd {
  // font-weight: bold;
  font-size: 32px;
  margin: 0 0 0 32px;
  display: block;
  padding: 15px 0;
  color: #333333;
}
.weui-cell_select-after {
  width: 100%;
}
.beijingtu {
  width: 100%;
  height: 880px;
  background: url("../../common/images/beijing.png") no-repeat;
  background-size: 100% 100%;
  position: absolute;
  z-index: -9000;
  margin-top: -210px;
}

.bottom {
  width: 100%;
  height: 190px;
  background: url("../../common/images/dbg.png") no-repeat;
  background-size: 100%;
  position: fixed;
  bottom: 0;
  // margin-top: 4rem;
}
.box2 {
  position: relative;
}
.describe {
  font-size: $font-size-base;
  margin: 40px 0 20px 0;
  color: #666666;
}
.box2{
  padding-left: 35px;
}
.box1 {
  // width: 90%;
  margin: 40px auto;
  padding: 15px 0 40px 0;
  margin-bottom: 3rem;
  background: white;
  overflow: hidden;
  border-radius: 4px;
}
</style>
